<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="../css/xiangqing.css"/>
	</head>
	<body>
		<!--链接首页头部-->
		<div id="index_top"></div>
		<!--链接首页的悬浮框-->
		<div id="index_floatRight"></div>
		<!--链接首页的回到顶部-->
		<div id="index_return_top"></div>
		<!--链接首页购物篮-->
		<div id="index_car"></div>
		<section>
			<!--顶部2px绿线-->
			<div class="xijiejuedingchengbai"></div>
			<!--当前位置-->
			<div class="dangqian">
				<p class="dangqian_left">
					当前位置: <a href="index.html">首页</a> > <a href="list.html">肉禽蛋品</a> > <a href="xiangqing.html">肉制品</a> > <a href="xiangqing.html">火腿 肠类 </a>> <a href="xiangqing.html">大成 德式香肠30g（烘焙） 1kg/袋 12袋/箱</a>
				</p>
				<div class="dangqian_right">
					<img src="../image/xiangqing_img/ic_03.jpg" alt="" />
				</div>
			</div>
			<!--详情页东西-->
			<div class="xq_content">
				<!--放图-->
				<div class="xq_left">
					<!--图片盒子-->
					<div id="mask">
						<!--商品ID-->
						<div class="pic" >
							<img src="../image/xiangqing_img/fdj0.jpg"/>
							<!--放大镜-->
							<span id="fdj"></span>
							<!--被放大盒子-->
							<div id="big_pic">
								<img src="../image/xiangqing_img/fdj0.jpg" alt="" />
							</div>
						</div>
					</div>
					<!--小图盒子-->
					<div class="small_pic">
						<!--<span class="left_jiantou"></span>-->
						<span class="fdj_1"><img src="../image/xiangqing_img/fdj0.jpg"/></span>
						<span class="fdj_1"><img src="../image/xiangqing_img/fdj1.jpg"/></span>
						<span class="fdj_1"><img src="../image/xiangqing_img/fdj2.jpg"/></span>
						<span class="fdj_1"><img src="../image/xiangqing_img/fdj3.jpg"/></span>
						<span class="fdj_1"><img src="../image/xiangqing_img/fdj4.jpg"/></span>
						<!--<span class="right_jiantou"></span>-->
					</div>
				</div>
				<!--介绍-->
				<div class="xq_right">
					<!--主题-->
					<h2 class="zhuti" id="hanbao">
						大成 德式香肠30g(烘焙) 1Kg/袋  12袋/箱.
					</h2>
					<!--介绍-->
					<p class="jieshao">大成德式香肠30g（烘焙），沿袭了经典德国风味，精选优质的猪肉和鸡肉制作，100%纯肉制品，不含淀粉，大块肉粒，配以欧洲多种天然香料秘制而成，再加上美洲胡桃木熏制，口感鲜嫩多汁，外皮香脆，口口劲爆。整箱购买价格更实惠!</p>
					<!--价格盒子-->
					<div class="price">
						<div class="jia">
							美鲜价：
						</div>
						<!--接收数据盒子-->
						<div class="jiage">
							34.00
						</div>
					</div>
					<!--商品规格-->
					<div class="guige">
						<p><span>商品规格：</span><i>321321,321321</i></p>
						<p><span>购买赠送：</span><i>34积分</i></p>
						<p><span>商品货号：</span><i>382132</i></p>
					</div>
					<!--选择-->
					<div class="xuanze">
						<p>购买单位：<span class="dan">单袋</span><span class="shuang dan">整箱</span></p>
						<!--<p>商品规格：<span class="guigeshu">德式香肠30g(烘焙)</span></p>-->
						<p>商品规格：<span class="dizhi">德式香肠30g(烘焙)</span></p>
						<p>发货仓库：<span class="dizhi">济南<i class="kucun">(库存414)</i></span></p>
						<div class="shuliang">
							<span class="number">
								购买数量：
							</span>
							<span id="jian">-</span>
							<span id="ji">1</span>
							<span id="jia">+</span>
						</div>
					</div>
					<!--结账-->
					<div class="buy">
						<div id="but1">
							
						</div>
						<div id="but2">
							
						</div>
					</div>
					<!--温馨提示-->
					<div class="tishi">
						<span class="piaol">温馨提示：</span>
						<i class="beijing">
							<div class="shiba">
								-18°以下
							</div>
						</i>
					</div>
					<!---->
				</div>
			</div>
			<!-- 详情底部-->
			<div class="xiangqing_bottom">
				<!--详情左-->
				<div class="bottom_left">
					<!--详情-->
					<div class="left_top">
						<ul>
							<li class="y1 y111">商品介绍</li>
							<li class="y1">买家须知</li>
							<li class="y1">售后保障</li>
							<li class="y1">商品评价</li>
							<li class="y1">相关证书</li>
						</ul>
					</div>
					<!--介绍-->
					<ul class="left_zhongjian">
						<li>商品名称：<span class="spmc">大成 德式香肠30g(烘焙) 1kg/袋</span></li>
						<li>品牌：<span class="sppp">大成</span></li>
						<li>上架时间：<span class="sjsj">2015-01-18</span></li>
						<li>包装：<span class="bz">精装</span></li>
						<li>保质期：<span class="bzq">12个月</span></li>
						<li>产地：</li>
					</ul>
					<!--照片盒子-->
					<div class="piche">
						<img src="../image/xiangqing_img/01.jpg" alt="" />
						<img src="../image/xiangqing_img/02.jpg" alt="" />
						<img src="../image/xiangqing_img/03.jpg" alt="" />
						<img src="../image/xiangqing_img/04.jpg" alt="" />
						<img src="../image/xiangqing_img/05.jpg" alt="" />
						<img src="../image/xiangqing_img/06.jpg" alt="" />
						<img src="../image/xiangqing_img/07.jpg" alt="" />
						<img src="../image/xiangqing_img/08.jpg" alt="" />
					</div>
					<!--买家须知-->
					<div class="piche" id="piche1">
						<img src="../image/xiangqing_img/mjxz.jpg"/>
					</div>
					<!--售后保证-->
					<div class="piche">
						<img src="../image/xiangqing_img/baozhang.jpg"/>
					</div>
					<div class="piche">
						
					</div>
					<div class="piche">
						<img src="../image/xiangqing_img/03.jpg"/>
					</div>
				</div>
				<!--右边-->
				<div class="bottom_right">
					<ul class="list">
						<h4>相关分类</h4>
						<li><a href="">培根</a><a href="">  烟肉</a></li>
						<li><a href="">丸子类</a></li>
						<li><a href="">火腿 肠类</a></li>
					</ul>
					<ul class="list2">
						<h4>相关分类</h4>
						<li><a href="">培根</a><a href="">  烟肉</a></li>
						<li><a href="">丸子类</a></li>
						<li><a href="">火腿 肠类</a></li>
					</ul>
					<ul id="list">
						<!--调用json数据-->
						<h2>大家都喜欢</h2>
					</ul>
				</div>
				<!---->
			</div>
		</section>
		<!--链接首页的底部-->
		<div id="index_footer"></div>
	</body>
</html>
<script src="../js/jq.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/jquery.cookie.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/xiangqing.js" type="text/javascript" charset="utf-8"></script>
<!--
	链接头部、尾部、侧边栏.
-->
	<script>
		$("#index_top").load("index.html header",function(){
		//二级菜单的效果.
		$("#menu_1 li").bind("mouseenter",function(){
			//滑过每个li让颜色变白.
//			$(this).css("background":"#ffffff");
			$(this).children("div").css({"z-index":666}).stop().fadeIn()
			//console.log($(this));
			$(this).children(".hehe").css({"background":"#ffffff","color":"#1a9733"})
		}).bind("mouseleave",function(){
			$(this).children("div").stop().fadeOut();
			$(this).children(".hehe").css({"background":"#1a9733","color":"#ffffff"});
		})
		//改变二级菜单的背景.
		$("#menu").css({"background":"#1a9733","display":"none"});
		//鼠标滑过的时候让二级菜单出来.
		$("#nav_left").hover(function(){
			$("#menu").css({"display":"block"});
		},function(){
			$("#menu").css({"display":"none"});
		})
		//登录事件
		console.log(document.cookie);
		if($.cookie("sure")){
			//让原本的初始改成用户的用户名.
		//	$("#hTop1_left_ul").css({"display":"none"});
			$("#huanying").html($.cookie("sure")+",欢迎光临美鲜冻品商城");
			$("#te1").css({"display":"none"});
			$("#te2").css({"display":"none"});
			$("#te3 a").css({"display":"block"});
		}
		$("#te3").click(function(){
			$.removeCookie("sure",{path:'/'})
			window.location.reload();
		})
	});
	/*
	 * 通过load链接右侧悬浮框与回到顶部的悬浮.
	 */
	$("#index_floatRight").load("index.html #float_r",function(){
		//2.鼠标滑过购物篮变色.
	$(".r_car").hover(function(){
		//让自己变绿.
		$(this).css({"background":"#1a9733"})
		//让购物车变白色.
		$(".che").css({"background":"url(../image/yuan.png) no-repeat -24px -154px"})
	},function(){
		//移出变回
		$(this).css({"background":""})
		$(".che").css({"background":"url(../image/yuan.png) no-repeat 2px -154px"})
	})
////////////////////////////////结束/////////////////////////////////////
	//3.鼠标点击右浮动购物车让购物篮出来.
	$(".r_car").click(function(){
		$(".car_box").toggle();
	})
////////////////////////////////结束/////////////////////////////////////
	//4.滑过QQ让东西出来.
	$(".qq").hover(function(){
		$(this).css({"background":"#1EAA39"})
		//让QQ对话框出来.
		$(".qq_l").css({"display":"block"})
	},function(){
		$(this).css({"background":""})
		//划出消失.
		$(".qq_l").css({"display":"none"})
	})
////////////////////////////////结束/////////////////////////////////////
	//5.滑过phone让东西出来.
	$(".phone").hover(function(){
		$(this).css({"background":"#1EAA39"})
		//让QQ对话框出来.
		$(".phone_l").css({"display":"block"})
	},function(){
		$(this).css({"background":""})
		//划出消失.
		$(".phone_l").css({"display":"none"})
	})
////////////////////////////////结束/////////////////////////////////////
	//6.鼠标滑过二维码让二维码出来.
	$(".erwei").hover(function(){
		$(".erwei_l").stop().animate({"left":"-190px"})
	},function(){
		$(".erwei_l").stop().animate({"left":"40px"})
	})
////////////////////////////////结束/////////////////////////////////////
	});
	$("#index_return_top").load("index.html #retrun_top_ge",function(){
	/*
	 * 悬浮框的事件.
	 */
	//1.回到顶部.并让顶部按钮颜色变色.
	var retrun_top = document.getElementById("retrun_top");
	//console.log(scrollTop);
	retrun_top.onclick = function(){
		document.documentElement.scrollTop = 0;
	}
	$("#retrun_top_ge").hover(function(){
		$(this).css({"background":"green"})
	},function(){
		$(this).css({"background":"black"})
	})
////////////////////////////////结束/////////////////////////////////////
	})
	/*
	 * 获取购物篮子
	 */
	$("#index_car").load("index.html .car_box",function(){
		//设置一个开关.
		var kg = true;
		$(".r_car").click(function(){
			if(kg){
				$(".car_box").css({display:"block"});
				kg = false;
			}else{
				$(".car_box").css({display:"none"});
				kg = true;
			}
		})
	});
	/*
	 * 获取首页底部
	 */
	$("#index_footer").load("index.html footer");
	</script>